<template>
  <div class="myresume-file">
    <div class="myresume-file-item flex-row align-items-center mb-12" v-for="(item, index) in fileData" :key="index">
      <div class="flex-1">
        <div>{{item.filename}}.{{ item.extension }}</div>
        <div class="f-12 mt-4 gray-color">{{ item.created_at }}上传</div>
      </div>
      <div class="flex-row">
       <div class="mr-8">
        <pk-button size="small" type="danger" @click="fileDel(item)">删除</pk-button>
       </div>
       <div class="mr-8" v-if="item?.extension?.indexOf('pdf') > -1" @click="viewPDF(item)">
        <pk-button size="small">点击浏览</pk-button>
       </div>
       <div class="mr-8" v-if="item?.extension!='pdf'" @click="viewImg(item)">
        <pk-button size="small">点击浏览</pk-button>
       </div>
       <div class="mr-8" v-if="!item.default">
        <pk-button size="small" @click="setDefault(item)" :loading="loading">设置默认</pk-button>
       </div>
       <div class="mr-8" v-if="item.default">
        <pk-button size="small" type="text">默认简历</pk-button>
       </div>
      </div>
    </div>
    <pk-dialog v-if="isDialog" @onClose="isDialog=false" @confirm="isDialog=false">
      <el-image :src="resumePath" lazy fit="cover" />
    </pk-dialog>
  </div>
</template>

<script setup>
  import { ref, onMounted, defineProps, defineExpose } from 'vue'
  import pkButton from '@/components/pkui/pkbutton/pkbutton.vue'
  import { attachmentGetList, attachmentSetDefault, attachmentDelete } from '@/api/api'
  import { ElMessage, ElMessageBox } from 'element-plus'
  import { getTime } from '@/utils/utils'
  import pkDialog from '@/components/pkui/pkdialog/pkdialog.vue'
  const resumePath = ref('')
  const isDialog = ref(false)
  const loading = ref(false)
  defineProps({
    data: { 
      type: Array,
      default: () => [1] 
    }
  })

  const fileData = ref([])
  const getList = () => {
    attachmentGetList().then(res => {
      fileData.value = res.data.map(item => {
        return {
          ...item,
          created_at: getTime(item.created_at, 'time')
        }
      })
    })
  }

  const setDefault = (e) => {
    loading.value = true
    attachmentSetDefault({
      attachment_id: e.attachment_id
    }).then(res => {
      loading.value = false
      getList()
    }).catch(err => {
      loading.value = false
    })
  }

  const viewImg = (e) => {
    resumePathl.value = e.source_link
    isDialog.value = true
  }

  const fileDel = (e) => {
    ElMessageBox.confirm(
    '确定要删除?',
    '提示',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
  .then(() => {
    attachmentDelete({
      attachment_id: e.attachment_id
    }).then(res => {
      getList()
    })
  })
  }

  const viewPDF = (item) => {
    window.open(item.source_link, '_blank')
  }

  defineExpose({
    getList
  })

  onMounted(() => {
    getList()
  })
</script>

<style lang="scss" scoped>
.myresume-file{
  font-size: 14px;
  padding: 12px 0;
}
</style>